import Vue from 'vue'
import store from '@/store'

import VueRouter from 'vue-router'
// 进行切换效果一定要用路由,用路由一定记得要导入需要的组件
// 引入登录的组件
// import Login from '../views/Login'
// import Layout from '../views/Layout'
// import Search from '../views/Search'
// import SearchResult from '@/views/SearchResult'
// import ArticleDetail from '@/views/ArticleDetail'
// import UserEditor from '@/views/User/UserEditor/index'
// import Chat from '@/views/Chat'

// 二级页面
// import Home from '../views/Home'
// import User from '../views/User'

Vue.use(VueRouter)
// 路由懒加载
const routes = [
  { path: '/', redirect: '/layout' },
  { path: '/search', component: () => import('@/views/Search') },
  { path: '/search/:keywords', component: () => import('@/views/SearchResult') },
  { path: '/login', component: () => import('@/views/Login') },
  { path: '/chat', component: () => import('@/views/Chat') },

  { path: '/user/edit', component: () => import('@/views/User/UserEditor/index') },
  { path: '/art_detail', component: () => import('@/views/ArticleDetail') },

  {
    path: '/layout',
    component: () => import('@/views/Layout'),
    redirect: '/layout/home',
    children: [
      { path: 'home', component: () => import('@/views/Home') },
      { path: 'user', component: () => import('@/views/User') }

    ]

  }

]

const router = new VueRouter({
  routes
})
// 需求：已经登陆了，就不能再跳转到登录页面
router.beforeEach((to, from, next) => {
  if (store.state.token.length > 0 && to.path === '/login') {
    // 已经登录了，并且要跳转到登录页面
    next(false)// 停在原地
  } else {
    next()
  }
}
)
// 需求2：首页是可以看的，因为不需要token认证
// 而应该在设计到用户擦啊哦做的页面动作，需要登录（点赞）
// 那如果过没有token，后台就会返回401，所以无token，或者过期
// 会在响应拦截器处理
// （注意一定要清空token）
// 需求3：有token，但是被篡改了
// 现象：报401
// 原因：路由守卫判定token成立-阻止了login的跳转
// 解决：token过期后，把本地和vuex中的token清掉，此时就没有token，要跳转login页面，且路由守卫的if进不去，就放行了，就进入了登录页面
export default router
